<template lang="html">
    <el-col :span="24">
        <el-menu :default-active="active" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose" theme="dark" :router='true'>
            <div class="icon-logo">
                <img class="icon-logo-img" src="../../assets/wallet/logo.png" alt="">
                <span class="icon-logo-tit" @click="test">发行管理系统</span>
            </div>
            <el-submenu index="/process/agency">
                <template slot="title">流程管理</template>
                <el-menu-item index="/process/agency">待办流程</el-menu-item>
                <el-menu-item index="/process/already">已办流程</el-menu-item>
            </el-submenu>

            <el-submenu index="/home/issuinglist">
                <template slot="title">发币管理</template>
                <el-menu-item v-if="UserAuthLevel === 1" index="/home/applyforissuing">申请发币</el-menu-item>
                <el-menu-item index="/home/issuinglist">发币列表</el-menu-item>
            </el-submenu>

        </el-menu>
    </el-col>
</template>

<script>
import { mapState, mapMutations, mapActions, mapGetters } from 'vuex';
export default {
    name: 'leftNav',
    data() {
        let GETTER = this.$store.getters;
        return {
            msg: 'leftNav',
            active:GETTER.GET_ROUTER_PATH,
            UserAuthLevel: GETTER.G_USER_AUTH_LEVEL,
        }
    },
    computed: {
        ...mapGetters(['G_USER_AUTH_LEVEL','GET_ROUTER_PATH']),
    },
    created() {

    },
    methods: {
        handleOpen(key, keyPath) {
            // console.log(key, keyPath);
        },
        handleClose(key, keyPath) {
            // console.log(key, keyPath);
        },
        test(){
            console.log(1);
            this.$router.push({name:'details',params:{id:1}});
        }
    },
    watch:{
        '$route'(to,form){
            this.active = this.GET_ROUTER_PATH;
        }
    }
}
</script>

<style lang="less">
.el-menu-vertical-demo {
    height: 100vh;
    border-radius: 0;
}

.icon-logo {
    height: 56px;
    line-height: 56px;
    text-align: center;
    font-size: 18px;
    color: #fff;
    .icon-logo-img {
        width: 35px;
        height: 30px;
        vertical-align: middle; // margin-right: 10px;
        display: inline-block;
    }
    .icon-logo-tit {
        height: 30px;
        line-height: 30px;
        vertical-align: middle;
        display: inline-block;
        margin-left: 10px;
        font-size: 16px;
    }
}
</style>
